
<template>
	<view :class="[isFixed?'pos-f w-full z-index-996 top-0':'',barClass]" :style="{paddingTop:statusBarHeight+'px'}">
		<view class="pos-r" :class="otherSe" :style="{height:navBarHeight+'px',lineHeight:navBarHeight+'px'}">
			<slot></slot><!--左则按钮，必须带.nav-bar-left样式-->
			<slot name="right"></slot><!--右则按钮，必须带.nav-bar-right样式-->
			<view class="iconfont icon-jt-l fs-30 nav-bar-left" v-if="hasReback" @click="reback"></view>
			<view class="ta-c fs-36 f-bold" v-if="!notTitle" :class="titleSe">{{title}}</view>
		</view>
	</view>
</template>

<script>
	import {mapState,storeToRefs} from 'pinia';
	import {useSystemStore} from '@/stores/system.js';

	export default {
		props:{
			title:{
				type:String,
				default:'标题'
			},
			notTitle:{
				type:Boolean,
				default:false
			},
			hasReback:{
				type:Boolean,
				default:true
			},
			isFixed:{
				type:Boolean,
				default:true
			},
			barClass:{
				type:String,
				default:''
			},
			titleSe:{
				type:String,
				default:'se-deep-txt'
			},
			otherSe:{
				type:String,
				default:'se-deep-txt'
			}
		},
		data() {
			return {
				
			};
		},
		computed:{
			...mapState(useSystemStore,['statusBarHeight','navBarHeight'])
		},
		watch:{
			title:{
				handler(v){
					uni.setNavigationBarTitle({
						title:v
					})
				},
				immediate:true
			}
		},
		methods:{
			reback(){
				uni.navigateBack();
			}
		}
	}
</script>

<style lang="scss">
	
</style>
